/*
 * SmartAdmin 独有的样式
 *
 * @Author:    1024创新实验室-主任：卓大
 * @Date:      2022-09-12 14:43:01
 * @Wechat:    zhuda1024
 * @Email:     lab1024@163.com
 * @Copyright  1024创新实验室 （ https://1024lab.net ），Since 2012
 */

/**********************************  宽度 **********************************/
.smart-width-100 {
  width: 100%;
}

/**********************************  左间距 **********************************/
.smart-margin-left5 {
  margin-left: 5px;
}

.smart-margin-left10 {
  margin-left: 10px;
}

.smart-margin-left15 {
  margin-left: 15px;
}

.smart-margin-left20 {
  margin-left: 20px;
}

/**********************************  右间距 **********************************/
.smart-margin-right5 {
  margin-right: 5px;
}

.smart-margin-right10 {
  margin-right: 10px;
}

.smart-margin-right15 {
  margin-right: 15px;
}

.smart-margin-right20 {
  margin-right: 20px;
}

/******************************** 上间距 ********************************/
.smart-margin-top5 {
  margin-top: 5px;
}

.smart-margin-top10 {
  margin-top: 10px;
}

/******************************** 下间距 ********************************/
.smart-margin-bottom0 {
  margin-bottom: 0;
}

.smart-margin-bottom5 {
  margin-bottom: 5px;
}

.smart-margin-bottom10 {
  margin-bottom: 10px;
}
/******************************** 圆角 ********************************/
.smart-radius-2 {
  border-radius: 2px;
}

/******************************** 查询表格样式 ********************************/
.smart-query-form {
  --grid-column-col: 6;
  display: grid;
  grid-template-columns: repeat(var(--grid-column-col), 1fr);
  gap: 8px;
  overflow-y: hidden;
  height: @query-form-height;
  background-color: #ffffff;
  padding: 5px 10px;
  margin-bottom: 10px;
}

// TODO isOpen类名需要与component/support/search-form-collapse中保持一致,后续需要优化
.smart-query-form:has(.isOpen) {
  height: auto;
}

.smart-query-form-item:has(button.isClose) {
  grid-area: 1 / var(--grid-column-col) / 2 / calc(var(--grid-column-col) + 1);
}
.smart-query-form-item:has(button.isOpen) {
  grid-area: unset;
}

.smart-table-operate {
  .ant-btn {
    padding: 0 3px !important;
    height: auto;
  }
}

.smart-table-column-operate {
  float: right;
}

.smart-query-form .smart-query-form-item {
  margin-bottom: 0;
}

.smart-query-table-page {
  margin-top: 10px;
  display: flex;
  justify-content: flex-end;
}

.smart-table-btn-block {
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  .smart-table-operate-block {
    .ant-btn {
      margin-right: 12px;
    }
  }
  .smart-table-setting-block {
    float: right;
  }
}

/******************************** 灰度模式 ********************************/
.grey-mode {
  filter: grayscale(100%);
}

/******************************** 自定义抽屉关闭按钮 ********************************/
.express-bar {
  color: #323232;
  pointer-events: auto;
  cursor: pointer;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  left: -132px;
  top: 144px;
  width: 220px;
  height: 44px;
  position: absolute;
  transform: rotate(-90deg);
  clip-path: path('M6.7,45.5c5.7,0.1,14.1-0.4,23.3-4c5.7-2.3,9.9-5,18.1-10.5c10.7-7.1,11.8-9.2,20.6-14.3c5-2.9,9.2-5.2,15.2-7c7.1-2.1,13.3-2.3,17.6-2.1c4.2-0.2,10.5,0.1,17.6,2.1c6.1,1.8,10.2,4.1,15.2,7c8.8,5,9.9,7.1,20.6,14.3c8.3,5.5,12.4,8.2,18.1,10.5c9.2,3.6,17.6,4.2,23.3,4H6.7z');
  will-change: transform;
  background-color: #f9f9f9;
}
.express-btn {
  color: #323232;
  pointer-events: auto;
  cursor: pointer;
  margin: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  top: 146px;
  padding: 6px;
  position: absolute;
  border-radius: 50%;
  left: -32px;
  font-size: 28px;
  transition: all 0.5s;
}
.express-btn:hover {
  color: @primary-color;
  rotate: 90deg;
}
